<template>
  <view
    class="bg-white"
    style="position: fixed; bottom: 0; padding: 6px"
    :style="'width:' + buttonWidth + 'px'"
  >
    <AtButton type="primary" @click="back" :circle="true" size="small"
      ><text class="cuIcon-add"></text>添加渠道</AtButton
    >
  </view>
</template>

<script lang="ts">
// npm
import { defineComponent, ref } from 'vue'
import Taro from '@tarojs/taro'
import { AtButton } from 'taro-ui-vue3/lib'
import { useScreen } from '@/utils/useScreen.ts'
// component
// interface
// json
// api

export default defineComponent({
  name: '',
  components: { AtButton },
  setup() {
    const res = useScreen()
    console.log(res)

    const buttonWidth = ref(0)

    buttonWidth.value = res.screenWidth.value - 12
    // onMounted(() => {
    //   const res = Taro.getSystemInfo()
    //   console.log(res.screenWidth)
    //   // buttonWidth.value = res.screenWidth - 20
    // })
    return {
      buttonWidth,
    }
  },
})
</script>
<style scoped></style>
